<!doctype html>
<html>
<head>
<meta charset="UTF-8"> 
<title>苏宁易购：个人中心-修改</title>
<include file="__VIEW__/Common/hearder" />
<link rel="stylesheet" href="__STATIC__/Index/Css/list.css" />
<link rel="stylesheet" href="__STATIC__/Index/Css/hdjs.css" /> 
<link rel="stylesheet" href="__STATIC__/Index/Css/member.css" /> 
<script type="text/javascript" src="__STATIC__/Index/Js/hdjs.min.js"></script>

<!--上传插件uploadify的文件--> 
        <script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
        <link href="__STATIC__/uploadify/uploadify.css" type="text/css" rel="stylesheet"></link>

        <script type="text/javascript">
            //让上传按钮显示
            function uploadifyShow(){
                     $('#file').uploadify({
                    'formData'     : {//POST数据
                        '<?php echo session_name();?>' : '<?php echo session_id();?>',
                    },
                    'fileTypeDesc' : '上传文件',//上传描述
                    'fileTypeExts' : '*.jpg;*.png',
                    'swf'      : '__STATIC__/uploadify/uploadify.swf',
                    'uploader' : '{|U:"upload"}',
                    'buttonText':'选择文件',
                    'fileSizeLimit' : '2000KB',
                    'uploadLimit' : 1,//上传文件数
                    'width':65,
                    'height':25,
                    'multi': false,//是否多文件上传
                    'successTimeout':10,//等待服务器响应时间
                    'removeTimeout' : 0.2,//成功显示时间
                    'onUploadSuccess' : function(file, data, response) {
                        //把变量转为json
                        data=$.parseJSON(data);
                        var li="<li path='"+data.path+"' url='"+data.url+"'><img src='"+data.url+"' style='width:90px;' class='img-thumbnail'/><a href='javascript:;' class='del-img'>X</a><input type='hidden' name='face' value='"+data.path+"' /></li>";
                        $("#uploadList ul").prepend(li);
                        //让删除按钮消失
                        $('.uplodify-box').html('');
                    }
                });
            }
            $(function(){
                    //刷新页面让上传插件显示
                    uploadifyShow();
                    //点击x，隐藏图片，并且上传按钮显示
                $('.del-img').live('click',function(){
                    //获得当前图片的所在的li，让其消失
                    $(this).parent('li').hide();
                    //上传按钮显示
                    $('.uplodify-box').html('<input id="file" type="file" multiple="false"><span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>');
                    uploadifyShow();
                    
                })
            });
        </script>


        <style type="text/css">
        #uploadList{
            width: 600px; 
        }
        #uploadList li{
            width: 90px; 
            margin-right: 10px;
            list-style: none;
            position: relative;
        } 
        #uploadList li img{
            width: 90px;  
        }  
        #uploadList li a{
            display: block;
            position: absolute;
            top:0px;
            right:0px; 
            width: 20px;
            height: 20px; 
            color: #f90;
        }  

        </style>

　<div class="position"><a href="__ROOT__">首页</a>&gt<a href="{|U:'Member/member'}">个人中心</a>&gt修改资料</div> 

<div class="list_main"> 
	<include file="__VIEW__/Common/member_left" />
	<!--右侧-->
	<div class="list_main_r">　 
			<div class="mber_r">
				<div class="me_data">
					
<!--表单验证Start-->
<script>
    $(function () {
        $('#HDJS').validate({ 
        	nickname: {
                rule: {
                    required: true
                },
                error: {
                    required: '昵称不能为空'
                },
                success: '验证通过',
                message: '请输入昵称'
            },  

            username: {
                rule: {
                    required: true
                },
                error: {
                    required: '用户名不能为空'
                },
                success: '验证通过',
                message: '请输入用户名'
            },
            
             
            
            sex: {
                rule: {
                    required: true
                },
                error: {
                    required: '请选择性别'
                }
            },
            email: {
                rule: {
                    required: true,
                    email: true
                },
                error: {
                    required: '邮箱不能为空',
                    email: '邮箱不正确'
                },
                success: '输入正确',
                message: '请输入邮箱'
            },
            address: {
                rule: {
                    required: true
                },
                error: {
                    required: '详细地址不能为空'
                },
                success: '验证通过',
                message: '请输入详细地址'
            },


            tel: {
                rule: {
                    tel: true
                },
                error: {
                    tel: '手机号错误'
                }
                
            },
             
        })
    })
</script>
<!--表单验证End-->
<form id="HDJS" action="" method="post">
    <table class="hd-form hd-table hd-table-form">
        <thead>
        <tr>
            <td colspan="2">我的资料</td>
        </tr>
        </thead>
        <tbody>
        	
        <tr>
            <th class="hd-w150">上传头像</th>
            <td> 
			<div class='imgface_box'> 
					<!-- <img src="{$userInfo.face}" alt="" style="width:90px;" id="preview"/>  -->
            <div lab="uploadFile">
                <!--这个div是放上传按钮的-->
                <div class="uplodify-box">
                    <!--如果没有上传图片，显示上传按钮-->
                    <if value="!$userInfo['face']">
                        <input id="file" type="file" multiple="false">
                            <span>类型: *.jpg,*.png 大小: 2000KB 数量: 10</span>
                    </if>
                </div>
                <div id="uploadList">
                    <ul>
                            <!--如果有图片上传，则显示图片-->
                            <if value="$userInfo['face']">
                                <li>
                                    <img src="__ROOT__/{$userInfo.face}" style="width:90px;"/>
                                    <a href="javascript:;" class="del-img" path="{$userInfo.face}">X</a>
                                </li>
                            </if>
                            
                    </ul>
                </div>
            </div> 

			</div> 
		
            </td>
        </tr>
        

        <tr>
            <th class="hd-w150">昵    称</th>
            <td>
                <input name="nickname" value="{$userInfo.nickname}" type="text">
            </td>
        </tr>
        
        <tr>
            <th class="hd-w150">用户名</th>
            <td>
                <input name="username" value="{$userInfo.username}" type="text">
            </td>
        </tr>
        
        <!-- <tr>
            <th class="hd-w150">密码</th>
            <td>
                <input name="password_1" type="text">
            </td>
        </tr>
        <tr>
            <th class="hd-w150">确认密码</th>
            <td>
                <input name="password_2" type="text">
            </td>
        </tr> --> 
        
        <tr>
            <th>性别</th>
            <td>
                <label><input name="sex" value="男" type="radio" <if value="$userInfo.sex==男">checked</if> > 男</label>
                <label><input name="sex" value="女" type="radio" <if value="$userInfo.sex==女">checked</if> > 女</label> 

                <span id="hd_sex"></span>
            </td>
        </tr>
        <tr>
            <th>邮箱</th>
            <td>
                <input name="mailbox" value="{$userInfo.mailbox}" type="text">
            </td>
        </tr>
        <tr>
            <th class="hd-w150">详细地址</th>
            <td>
                <input name="address" value="{$userInfo.address}" type="text">
            </td>
        </tr>
         
        <tr>
            <th>手机号</th>
            <td>
                <input name="tel" value="{$userInfo.tel}" type="text">
            </td>
        </tr>
         
        <tr>
            <th></th>
            <td>
                <input value="确定" class="hd-btn hd-btn-sm c" type="submit">
            </td>
        </tr>
        
         
        
         
        </tbody>
    </table>
    	
</form>




				</div>
			</div>
			
			
	</div>
	 
	
</div>
<include file="__VIEW__/Common/footer" />